<template>
  <a class="thumbnail">
    <div class="figure" :style="{backgroundImage:'url('+item.smallpic+')'}">
        <div class="follow">
            <span>{{item.follow_num}}</span>
        </div>
    </div>
    <div class="title">{{item.name}}</div>
  </a>
</template>

<script>
export default {
    props:['item']
};
</script>


<style lang="stylus" scoped>
.thumbnail
    display block
    width 'calc(50% - %s)'% .28rem
    margin .03rem
    margin-right 0
    margin-left 0
    .figure
        width 100%
        height calc((3.75rem - 0.56rem) / 3)
        background-image url('https://static.missevan.com/mtags/201512/01/02b03508085127e1d3ed56561c632fa2100757.jpg')
        overflow hidden
        border-radius .04rem
        background-size 100%
        display flex
        justify-content flex-end
        .follow
            width .8rem
            height .2rem
            line-height .2rem
            padding 0 .05rem
            text-align right
            background-image linear-gradient(90deg,transparent,rgba(0,0,0,.2))
            border-top-right-radius .04rem
            span 
                color #fff
                font-size .12rem
                text-shadow: 0 .01rem .01rem rgba(0,0,0,.7);
                display flex
                justify-content flex-end
                align-items center
                &::before
                    content ""
                    display block
                    background-image url('https://static.missevan.com/assets/m/images/build/sprite-icons-thumbnails@2x.c71cb7b7.png')
                    width .15rem
                    height .13rem
                    background-position -.18rem -.26rem
                    background-size .56rem .55rem
                    
    .title
        color #616161
        line-height .2rem
        overflow hidden
        text-overflow ellipsis 
        word-break break-all
        height .4rem
        width 100%
        margin-top 0.03rem
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        
        
</style>